<!-- 弹窗设备 -->

<template>
  <WebTable :list="deviceList" noPage>
    <RowTitle :label="`${CORE.MAP.ASSET}名称`" bind="deviceName" :minWidth="100" />

    <RowText label="设备类型" bind="deviceCategoryName" />

    <RowText label="设备类别" bind="deviceTypeName" />

    <RowText :label="`${CORE.MAP.ASSET}编号`" bind="deviceCode" />

    <RowOperate :btns="['del']" del="解绑" :width="100" :onDel="toDel" />
  </WebTable>
</template>

<script>
// ============================== 导入依赖 ============================== //

import props from './props'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'ModalDevice',

  /**
   * 属性注册 (抽取以便查阅)
   */
  props,

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 解绑
     */
    async toDel(row) {
      const { deviceList } = this
      const index = deviceList.findIndex((item) => item.id === row.id)
      deviceList.splice(index, 1)
      this.$emit('del', row)
    },
  },
}
</script>
